<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%
	response.setHeader("Access-Control-Allow-Origin", "*");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


<html>

<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>${webName }·数据工厂</title>
<link href="${pageContext.request.contextPath }/img/webLogoIcon.png"
	rel="shortcut icon">
<link href="${pageContext.request.contextPath }/css/bootstrap.min.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath }/css/font-awesome.css"
	rel="stylesheet">

<link href="${pageContext.request.contextPath }/css/animate.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath }/css/style.css"
	rel="stylesheet">

<link
	href="${pageContext.request.contextPath }/css/plugins/chosen/chosen.css"
	rel="stylesheet">
<link
	href="${pageContext.request.contextPath }/css/plugins/select2/select2.min.css"
	rel="stylesheet">

<!-- FooTable -->
<link href="${pageContext.request.contextPath }/css/footable.core.css"
	rel="stylesheet">

<link href="${pageContext.request.contextPath}/css/mypage.css"
	rel="stylesheet">

<link
	href="${pageContext.request.contextPath}/font-awesome/css/font-awesome.css"
	rel="stylesheet">

<link
	href="${pageContext.request.contextPath}/css/plugins/iCheck/custom.css"
	rel="stylesheet">

<link
	href="${pageContext.request.contextPath}/css/plugins/switchery/switchery.css"
	rel="stylesheet">

<link
	href="${pageContext.request.contextPath}/css/plugins/jasny/jasny-bootstrap.min.css"
	rel="stylesheet">

<link
	href="${pageContext.request.contextPath}/css/plugins/nouslider/jquery.nouislider.css"
	rel="stylesheet">


<link
	href="${pageContext.request.contextPath}/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css"
	rel="stylesheet">

<link
	href="${pageContext.request.contextPath}/css/plugins/clockpicker/clockpicker.css"
	rel="stylesheet">

<link
	href="${pageContext.request.contextPath}/css/plugins/daterangepicker/daterangepicker-bs3.css"
	rel="stylesheet">


<link
	href="${pageContext.request.contextPath}/css/plugins/touchspin/jquery.bootstrap-touchspin.min.css"
	rel="stylesheet">


</head>

<body>

	<div id="wrapper">

		<nav class="navbar-default navbar-static-side" role="navigation">
		<jsp:include page="../components/left.jsp" flush="true" /> </nav>
		
		<div id="page-wrapper" class="	gray-bg">
			<div class="row border-bottom" style="margin-bottom: 20px;">
				<jsp:include page="../components/head.jsp" flush="true" />
			</div>
			<div class="row wrapper border-bottom white-bg page-heading">
				<div class="col-lg-6">
					<h2>${siteName}</h2>
					<ol class="breadcrumb">
						<li class="nav-main1"><a
							href="${pageContext.request.contextPath}/admin/tosystem_overview">主页</a>
						</li>
						<li class="active"><a>自媒体</a></li>
						<li class="active"><a>${webName }</a></li>
					</ol>
				</div>
			</div>


			<div class="wrapper wrapper-content animated fadeInRight main-a">
				<div class="row">
					<div class="col-lg-12">
						<div class="ibox float-e-margins">

							<div class="ibox-content charts" style="background-color: white;">

								<div class="forum-item" style="border-bottom: 0">
									<div class="row">
										<div class="col-md-9" style="width: 74%">
											<div class="forum-icon"
												style="margin-right: 11px; margin-bottom: 14px; margin-left: 6px">
												<i class="fa fa-clock-o"></i>
											</div>
											<a href="#"
												class="forum-item-title">${webName }·统计24小时内数据采集状态</a>
											<div class="forum-sub-title"
												style="margin-left: 40px; margin-top: 6px">数据采集总量:
												17,800,600，更新时间 5分钟前</div>
										</div>

										<div class="col-md-1 forum-info">
											<div class="feel">
												<small style="color: #46D59D">正面</small>
											</div>
											<span class="views-number" id="numb"> 1516 </span>

										</div>
										<div class="col-md-1 forum-info">
											<div class="feel">
												<small style="color: #FBBA3A">中性</small>
											</div>
											<span class="views-number" id="numb"> 238 </span>

										</div>
										<div class="col-md-1 forum-info">
											<div class="feel">
												<small style="color: #F73D60">负面</small>
											</div>
											<span class="views-number" id="numb"> 180 </span>

										</div>
									</div>
								</div>
								<div class="row" style="padding: 0 30px 0 10px;">
									<div id="container" style="width: 100%; height: 250px;"></div>
								</div>

							</div>
						</div>
					</div>
				</div>
			</div>


			<div class=" animated fadeInRight main-b" style="padding: 0px 10px;margin-bottom: 15px;">
				<div class="row">
					<div class="col-lg-12">
						<div class="ibox">
							<div class="ibox-content">
								<!-- search box1 start -->
								<div class="input-group">
									<div class="inputbox"
										style="position: relative; display: table;">
										<div class="input-group-btn">
											<button data-toggle="dropdown"
												class="btn btn-primary dropdown-toggle" type="button"
												style="border-radius: 3px 0 0 3px; margin-bottom: 0"
												aria-expanded="false">
												<i class="fa fa-bars"></i> &nbsp;
												<span id="inputSelected">全部</span>
											</button>
											<ul class="dropdown-menu" id="selectlist">
												<li><a onclick="setselect(this)">全部</a></li>
												<li><a onclick="setselect(this)">正文</a></li>
												<li><a onclick="setselect(this)">标题</a></li>
											</ul>
										</div>
										<input id="searchkeyword" type="text" class="form-control"
											style="width: 440px; padding-right: 42px;"> <i
											id="gosearch" class="fa fa-search cursearch" onclick="search()"></i>
									</div>
								</div>
								<!-- search box1 end -->
								<div class="row m-t-sm">
									<div class="col-lg-12">
										<div class="panel blank-panel">
											<div class="panel-body">
												<div class="tab-content">
													<div class="tab-pane active" id="tab-1">
														<div class="feed-activity-list" id="logs"></div>
														<div class="box" id="box"
															style="float: right; margin-top: 35px"></div>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>


			<jsp:include page="../components/footer.jsp" flush="true" />
		</div>
	</div>


	<!-- Mainly scripts -->
	<script src="${pageContext.request.contextPath }/js/jquery-2.1.1.js"></script>
	<script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/jquery.metisMenu.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/jquery.slimscroll.min.js"></script>

	<!-- Custom and plugin javascript -->
	<script src="${pageContext.request.contextPath }/js/inspinia.js"></script>
	<script src="${pageContext.request.contextPath }/js/pace.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/plugins/chosen/chosen.jquery.js"></script>

	<script
		src="${pageContext.request.contextPath }/js/plugins/pace/pace.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/plugins/jasny/jasny-bootstrap.min.js"></script>


	<!-- FooTable -->
	<script
		src="${pageContext.request.contextPath }/js/footable.all.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/mypage.js"></script>
	<!-- Sparkline -->
	<script
		src="${pageContext.request.contextPath}/in-admin/js/plugins/sparkline/jquery.sparkline.min.js"></script>
	<script
		src="${pageContext.request.contextPath}/js/anychart-base.min.js"></script>
	<!-- Page-Level Scripts -->
	<script
		src="${pageContext.request.contextPath}/js/plugins/select2/select2.full.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/userCustom.js"></script>
	<script>
		$(document).ready(function() {
			var data=${nowArray};
            createLine("微信公众号",1,data);
			sendListData(1);
			$('.chosen-select').chosen({
				search_contains : true, //设置全文查询
				disable_search_threshold : 20000
			//当下拉列表中的选项<4 时隐藏搜索功能
			});
			var config = {
				'.chosen-select' : {},
				'.chosen-select-deselect' : {
					allow_single_deselect : true
				},
				'.chosen-select-no-single' : {
					disable_search_threshold : 10
				},
				'.chosen-select-no-results' : {
					no_results_text : 'Oops, nothing found!'
				},
				'.chosen-select-width' : {
					width : "95%"
				}
			}
			for ( var selector in config) {
				$(selector).chosen(config[selector]);
			}
		});

		
		var matchingmodes = "全部";
        
        function setselect(that){
        	let type = $(that).text();
    		$('#inputSelected').html(type);
    		matchingmodes = type;
        }
        
        function search(){
        	carlist(1);
        }
        
		// 请求列表数据
		function sendListData(pageNum) {
			let classify = "${classify}";
			var searchkeyword = $('#searchkeyword').val()
			
			$.ajax({
						url : "${pageContext.request.contextPath}/information/getInformationList",
						type : "get",
						dataType : "json",
						data : {
							classify : classify,
							page : pageNum,
							searchWord : searchkeyword,
							matchingmode : matchingmodes
						},
						success : function(res) {
							console.log(res);
							groupListData(res);
						},
						error : function(err) {
							console.log(err);
						}
					});
		}

		// 组装列表数据
		function groupListData(res) {
			let list = res.list;
			let totalPage = res.totalPage;
			let pageNum = res.pageNum;
			let totalData = res.totalData;
			if (totalPage > 500) {
				totalPage = 500;
			}
			paging(totalData, totalPage, pageNum);
			if (list.length > 0) {
				$("#logs").html('');
				for (var i = 0; i < list.length; i++) {
					let num = 0;
					let keyWords = [];
					let keywordss = list[i].key_words
					if (keywordss != "") {
						let key_words = JSON.parse(keywordss);
						for ( let key in key_words) {
							if (num == 4) {
								break;
							}
							keyWords.push(key);
							num++;
						}
					}
					let art = list[i];
					let content = art.content;
					if (content.length > 201) {
						content = content.substring(0, 200) + "...";
					}
					/* let j = i + 1;
						let html = 
								"<div class='custom-article b-b'>"+
							    "    <div class='article-search-result'>"+
							    "        <div class='article-imgbox'>"+
							    "           <img style='width: 190px;height:140px' src='${pageContext.request.contextPath}/img/menhu/" + j + ".jpg'>"+
							    "        </div>"+
							    "        <div class='article-content'>"+
							    "        	<div class='article-content-title'>"+
							    "          		<a href='${pageContext.request.contextPath}/information/informationDetails?article_public_id="+art.article_public_id+"&type=weixinpublic' target='_blank'>"+art.title+"</a>"+
							    "            </div>"+
							    "            <div class='article-content-con'>"+content+"</div>"+
							    "        </div>"+
							    "    </div>"+
							    "    <div class='article-content-tips'>"+
							    "        	<div class='article-source'><i class='fa fa-globe'></i>来源网站："+art.sourcewebsitename+"</div>"+
							    "    		<div class='article-keywords'><i class='fa fa-tags'></i>关键词："+keyWords.join('，')+"</div>"+
							    "            <div class='article-time'><i class='fa fa-clock-o'></i>时间："+art.publish_time+"</div>"+
							    "    </div>"+
							    "</div>" */ 
					var api="${pageContext.request.contextPath}/information/informationDetails?article_public_id="+art.article_public_id+"&type=weixinpublic";
					$("#logs").append(notu(api,art.title,content,art.sourcewebsitename,keyWords,art.publish_time));
				}
			} else {
				$("#logs").html(
						"<div class='feed-element' ><h3>暂无数据</h3></div>");
			}
		}

		function paging(totalData, totalPage, pagenum) {
			$('#box').paging({
				initPageNo : pagenum, // 初始页码
				totalPages : totalPage, //总页数
				totalCount : '合计' + totalData + '条数据', // 条目总数
				slideSpeed : 600, // 缓动速度 单位毫秒
				jump : true, //是否支持跳转
				callback : function(page) {
					// 回调函数
				}
			});
		}

		function JumpToPage(pagenum) {
			if (pagenum > 500) {
				pagenum = 500;
			}
			sendListData(pagenum);
		}

		function fourLine() {
			var sparklineCharts = function() {
				$("#sparkline1").sparkline([ 34, 43, 43, 35, 44, 32, 44, 52 ],
						{
							type : 'line',
							width : '100%',
							height : '60',
							lineColor : '#1ab394',
							fillColor : "#ffffff"
						});

				$("#sparkline2").sparkline([ 24, 43, 43, 55, 44, 62, 44, 72 ],
						{
							type : 'line',
							width : '100%',
							height : '60',
							lineColor : '#1ab394',
							fillColor : "#ffffff"
						});

				$("#sparkline3").sparkline([ 74, 43, 23, 55, 54, 32, 24, 12 ],
						{
							type : 'line',
							width : '100%',
							height : '60',
							lineColor : '#ed5565',
							fillColor : "#ffffff"
						});

				$("#sparkline4").sparkline([ 24, 43, 33, 55, 64, 72, 44, 22 ],
						{
							type : 'line',
							width : '100%',
							height : '60',
							lineColor : '#ed5565',
							fillColor : "#ffffff"
						});
			};
			//        var sparkResize;
			//        $(window).resize(function(e) {
			//            clearTimeout(sparkResize);
			//            sparkResize = setTimeout(sparklineCharts, 500);
			//        });
			sparklineCharts();
		}

		function line() {
			anychart.onDocumentReady(function() {
				var dataSet = anychart.data.set(getData());
				var chart = anychart.line();
				chart.animation(true);
				chart.padding([ 10, 20, 5, 20 ]);
				chart.xAxis().labels().padding(5);
				chart.crosshair().enabled(true).yLabel(false).yStroke(null);
				chart.tooltip().positionMode('point');
				chart.title('统计14天每日数据采集状态走势');
				var seriesData_1 = dataSet.mapAs({
					'x' : 0,
					'value' : 1
				});
				var series_1 = chart.line(seriesData_1);
				series_1.name('日采集数量');
				series_1.hovered().markers().enabled(true).type('circle').size(
						4);
				series_1.tooltip().position('right').anchor('left-center')
						.offsetX(5).offsetY(5);
				chart.legend().enabled(true).fontSize(13).padding(
						[ 0, 0, 10, 0 ]);
				chart.container('container');
				chart.draw();

				$('.anychart-credits').remove()
			});

			function getData() {
				return [ [ '2-10', 17.5 ], [ '2-11', 18.9 ], [ '2-12', 20.8 ],
						[ '2-13', 22.9 ], [ '2-14', 25.2 ], [ '2-15', 27.0 ],
						[ '2-16', 26.5 ], [ '2-17', 25.3 ], [ '2-18', 23.4 ],
						[ '2-19', 19.5 ], [ '2-20', 17.8 ], [ '2-21', 16.2 ],
						[ '2-22', 15.4 ], [ '2-23', 14.0 ], [ '2-24', 12.5 ],
						[ '2-25', 10.8 ], [ '2-26', 8.9 ], [ '2-27', 18.0 ],
						[ '2-28', 6.2 ] ]
			}
		}

	</script>

</body>

</html>
